// 共同
:root {
  --header-height: 60px;
  --min-side-bar-width: 130px;
  --hide-side-bar-width: 60px;
  --submenu-height: 62px;
  --menu-item-height: 48px;
  --side-bar-padding: 19px;
  --side-bar-animation-duration: 0.3s;
  --side-bar-svgicon-size: 22px;
  --side-bar-img-width: 24px;
  --side-bar-img-height: 24px;
  --fold-unfold-height: 60px;
  // 业务样式
  --color-blue: #37a2fd;
  --primary-green: #6fba2c;
  --deep-green: #4f8918;
  --color-red: #ff6565;
  --color-org: #ff9114;
  --color-light-org: #f19944;
  // 管道云主题公共样式颜色
  --common-input: 30px;
  --white-theme: #fff;
  // --el-color-primary: #6fba2c;
  // --el-border-width: 1px;
  // --el-border-style: solid;
  // --el-border-color: #6fba2c;
}

/* 默认white主题 */
:root[theme='white'] {
  --body-theme: #f6f6f6;
  --color-000: #000;
  --color-333: #333;
  --color-666: #666;
  --color-999: #999;
  --color-999-light: #999;
  --color-ddd: #ddd;
  --color-blue: #37a2fd;
  --color-light-blue: #333;
  --color-primary-green: #6fba2c;
  --dark-white: #999;
  // 主色调
  --main-theme: #6fba2c;
  --primary-theme: #6fba2c;
  --light-theme: #fff;
  --light2-theme: #6fba2c;
  --subtone-theme: #6fba2c;
  // 副色调
  --vice-theme: #f5f5f5;
  --list-container-bg: #fff;
  --trigger-container-bg: #f2f2f2;
  --menu-theme-bg: #fff;
  // 其它样式

  // 四角边框
  --four-border-bg: #fff;
  --four-bg: #fff;
  // header样式
  --header-bg: #fff;
  --box-shadow: 0 0 10px #ccc;
  // link链接颜色
  --link-text-color: #6fba2c;
  --link-hover-text-color: #6fba2c;
  // 侧边栏样式
  --sidebar-bg: #fff;
  --sidebar-outer-submenu-bg: #fff;
  --sidebar-submenu-bg: #fff;
  --sidebar-submenu-active-bg: linear-gradient(
    to right,
    rgb(65, 185, 111) 0%,
    rgb(111, 186, 44) 100%
  );
  --sidebar-submenu-hover-bg: linear-gradient(
    to right,
    rgba(65, 185, 111, 0.3) 0%,
    rgba(111, 186, 44, 0.3) 100%
  );
  // --sidebar-submenu-hover-bg: rgba(111, 186, 44, 0.3);
  --sidebar-submenu-active-color: #fff;
  --sidebar-outer-submenu-text-color: #333;
  --sidebar-submenu-text-color: #000;
  // 伸缩按钮样式
  --hamburger-border-color: #eee;
  // 面包屑
  --breadcrumb-text-color: #666;
  --breadcrumb-link-text-color: #333;
  --breadcrumb-hover-text-color: #6fba2c;
  // dropdown下拉菜单样式
  --dropdown-active-bg: 111, 186, 44;
  --dropdown-text-color: #6fba2c;
  --dropdown-active-text-color: #6fba2c;
  // 输入框样式
  --input-bg: #fff;
  --input-border-color: #d7dee8;
  --input-hover-border-color: #6fba2c;
  --input-text-color: #333;
  --input-disabled-bg: #f5f7fa;
  --input-disabled-border-color: #e4e7ed;
  --input-disabled-text-color: #c0c4cc;
  --input-icon-color: #a8abb2;
  // 下拉框样式
  --select-bg: #fff;
  --select-hover-border-color: #6fba2c;
  --select-border-color: #d7dee8;
  --select-text-color: #333;
  --select-active-text-color: #6fba2c;
  --select-hover-bg: 111, 186, 44;
  --select-hover-text-color: #6fba2c;
  --select-icon-color: #a8abb2;
  // 级联选择器样式
  --cascader-hover-border-color: #6fba2c;
  --cascader-hover-text-color: #6fba2c;
  // 按钮样式
  --button-bg: #6fba2c;
  --button-border-color: #6fba2c;
  --button-text-color: #fff;
  --button-default-text-color: #333;
  --button-default-bg: #fff;
  --button-default-border-color: #dcdfe6;
  --button-default-hover-text-color: #6fba2c;
  --button-default-hover-border-color: #6fba2c;
  --button-text-text-color: #6fba2c;
  --button-disabled-text-color: #c0c4cc;
  // MessageBox弹框样式
  --message-box-bg: #fff;
  --message-box-text-color: #303133;
  // dialog样式
  --dialog-bg: #fff;
  --dialog-header-bg: #fff;
  --dialog-text-color: #333;
  // popover样式
  --popover-bg: #fff;
  --popover-border-color: #ebeef5;
  --popover-text-color: #606266;
  --popover-box-shadow: #fff;
  // 滚动条样式变量
  --scrollbar-thumb-bg: #999;
  --scrollbar-track-bg: #ddd;
  // el-table的样式变量
  --table-bg: #fff;
  --table-th-bg: #f3f4f6;
  --table-th-text-color: #000;
  --table-th-highlight-text-color: #6fba2c;
  --table-filter-button-text-color: #6fba2c;
  --table-tr-bg: #fff;
  --table-tr-striped-bg: #fafafa;
  --table-tr-text-color: #333;
  --table-tr-success-color: #6fba2c;
  --table-tr-danger-color: #f56c6c;
  // el-tabs的样式变量
  --tabs-text-color: #333;
  --tabs-active-text-color: #6fba2c;
  // 分页样式变量
  --pagination-btn-bg: #fff;
  --pagination-btn-border-bg: #6fba2c;
  --pagination-text-color: #333;
  --pagination-active-text-color: #fff;
  --pagination-hover-text-color: #6fba2c;
  --pagination-btn-active-bg: #6fba2c;
  // 单选框组 样式变量
  --radio-checked-bg: #6fba2c;
  --radio-border-color: #6fba2c;
  --radio-text-color: #333;
  --radio-hover-text-color: #6fba2c;
  // 日期时间选择器范围
  --range-editor-bg: #fff;
  --range-editor-border-color: #6fba2c;
  --range-editor-text-color: #333;
  // 日期时间选择器弹框样式
  --range-picker-btn-color: #6fba2c;
  --range-picker-text-color: #fff;
  // 步骤条样式
  --step-success-border-color: #6fba2c;
  --step-success-text-color: #6fba2c;
  --step-process-border-color: #333;
  --step-process-text-color: #333;
  // 计数器样式
  --input-number-btn-bg: #f5f7fa;
  --input-number-btn-border-color: #f5f7fa;
  --input-number-btn-text-color: #c0c4cc;
  // el-form样式
  --form-label-text-color: #333;
  --form-content-text-color: #333;
  // upload样式
  --upload-list-text-color: #333;
  // el-card样式
  --card-bg: #fff;
  --card-border-color: #fff;
  --card-text-color: #333;
  --card-header-border-color: #e0e5ed;
  // hamburger样式
  --hamburger-text-color: #333;
  // checkbox样式
  --checkbox-checker-bg: #6fba2c;
  --checkbox-checker-border-color: #6fba2c;
  --checkbox-checker-text-color: #333;
  --checkbox-checker-checked-text-color: #6fba2c;
  // tree样式
  --tree-bg: #fff;
  --tree-hover-bg: #6fba2c;
  --tree-text-color: #333;
  --tree-active-text-color: #6fba2c;
  // loading加载
  --loading-icon-color: #fff;
  --loading-text-color: #fff;
  // descriptions 描述列表
  --descriptions-text-color: #333;
  --descriptions-body-bg: #fff;
  --descriptions-label-bg: #f6f6f6;
  --descriptions-border-color: #ebeef5;
  // map地图
  --amap-marker-label-border-color: #ccc;
  --amap-marker-label-bg: #fff;
  --amap-marker-label-text-color: #333;
  // 导入弹窗
  --dialog-border-color: #ccc;
  // 设备管理的统计
  --device-statistics-text-color: #666;
  --device-statistics-text-color2: #000;
  // card卡片样式
  --card-bg-color: #fff;
  --card-border-color: #e4e7ed;
}

/* blue主题 */
:root[theme='blue'] {
  --body-theme: linear-gradient(to bottom, #1b3793 0%, #074082 100%);
  --color-000: #fff;
  --color-333: #fff;
  --color-666: #fff;
  --color-999: #fff;
  --color-999-light: #037fcd;
  --color-ddd: #fff;
  --color-blue: #17d3fd;
  --color-light-blue: #17d3fd;
  --color-primary-green: #319ce2;
  --dark-white: #d5e4f6;
  // 主色调
  --main-theme: #122b6e;
  --primary-theme: #037fcd;
  --light-theme: #037fcd;
  --light2-theme: #19d2fe;
  --subtone-theme: #fff;
  // 副色调
  --vice-theme: #037fcd;
  --list-container-bg: #122b6e;
  --trigger-container-bg: #0e2152;
  --menu-theme-bg: #122b6e;
  --sub-menu-hover-theme: #19d2fe;
  // 其它样式
  // 四角边框
  --four-border-bg: linear-gradient(#319ce2, #319ce2) left top,
    linear-gradient(#319ce2, #319ce2) left top,
    linear-gradient(#319ce2, #319ce2) right top,
    linear-gradient(#319ce2, #319ce2) right top,
    linear-gradient(#319ce2, #319ce2) left bottom,
    linear-gradient(#319ce2, #319ce2) left bottom,
    linear-gradient(#319ce2, #319ce2) right bottom,
    linear-gradient(#319ce2, #319ce2) right bottom;
  --four-bg: #122b6e;
  // header样式
  --header-bg: #122b6e;
  --box-shadow: 0 0 10px #122b6e;
  // link链接颜色
  --link-text-color: #fff;
  --link-hover-text-color: #17d3fd;
  // 侧边栏样式
  --sidebar-bg: #122b6e;
  --sidebar-outer-submenu-bg: #2d6294;
  --sidebar-submenu-bg: #122b6e;
  --sidebar-submenu-active-bg: #19d2fe;
  --sidebar-submenu-hover-bg: #19d2fe;
  --sidebar-submenu-active-color: #fff;
  --sidebar-outer-submenu-text-color: #bfcbd9;
  --sidebar-submenu-text-color: #fff;
  // 伸缩按钮样式
  --hamburger-border-color: #037fcd;
  // 面包屑
  --breadcrumb-text-color: #ddd;
  --breadcrumb-link-text-color: #fff;
  --breadcrumb-hover-text-color: #037fcd;
  // dropdown下拉菜单样式
  --dropdown-active-bg: 3, 127, 205;
  --dropdown-text-color: #fff;
  --dropdown-active-text-color: #037fcd;
  // 输入框样式
  --input-bg: #17327b;
  --input-border-color: #037fcd;
  --input-hover-border-color: #319ce2;
  --input-text-color: #fff;
  --input-disabled-bg: #3556b1;
  --input-disabled-border-color: #0f92e4;
  --input-disabled-text-color: #c0c4cc;
  --input-icon-color: #037fcd;
  // 下拉框样式
  --select-bg: #17327b;
  --select-hover-border-color: #037fcd;
  --select-border-color: #037fcd;
  --select-text-color: #fff;
  --select-active-text-color: #037fcd;
  --select-hover-bg: 204, 204, 204;
  --select-hover-text-color: #037fcd;
  --select-icon-color: #037fcd;
  // 级联选择器样式
  --cascader-hover-border-color: #037fcd;
  --cascader-hover-text-color: #037fcd;
  // 按钮样式
  --button-bg: #037fcd;
  --button-border-color: #037fcd;
  --button-text-color: #fff;
  --button-default-text-color: #fff;
  --button-default-bg: #122b6e;
  --button-default-border-color: #037fcd;
  --button-default-hover-text-color: #037fcd;
  --button-default-hover-border-color: #037fcd;
  --button-text-text-color: #fff;
  --button-disabled-text-color: #c0c4cc;
  // MessageBox弹框样式
  --message-box-bg: #122b6e;
  --message-box-text-color: #fff;
  // dialog样式
  --dialog-bg: #122b6e;
  --dialog-header-bg: #037fcd;
  --dialog-text-color: #fff;
  // popover样式
  --popover-bg: #122b6e;
  --popover-border-color: #122b6e;
  --popover-text-color: #fff;
  --popover-box-shadow: #001654;
  // 滚动条样式变量
  --scrollbar-thumb-bg: #2d6294;
  --scrollbar-track-bg: #184a79;
  // el-table的样式变量
  --table-bg: #004795;
  --table-th-bg: #003f86;
  --table-th-text-color: #eee;
  --table-th-highlight-text-color: #fff;
  --table-filter-button-text-color: #037fcd;
  --table-tr-bg: #004795;
  --table-tr-striped-bg: #145dac;
  --table-tr-text-color: #fff;
  // el-tabs的样式变量
  --tabs-text-color: #fff;
  --tabs-active-text-color: #037fcd;
  // 分页样式变量
  --pagination-btn-bg: #294b88;
  --pagination-btn-border-bg: #037fcd;
  --pagination-text-color: #fff;
  --pagination-active-text-color: #fff;
  --pagination-hover-text-color: #037fcd;
  --pagination-btn-active-bg: #2d6294;
  // 单选框组 样式变量
  --radio-checked-bg: #19d2fe;
  --radio-border-color: #19d2fe;
  --radio-text-color: #d5e4f6;
  --radio-hover-text-color: #037fcd;
  // 日期时间选择器范围
  --range-editor-bg: #17327b;
  --range-editor-border-color: #037fcd;
  --range-editor-text-color: #d5e4f6;
  // 日期时间选择器弹框样式
  --range-picker-btn-color: #037fcd;
  --range-picker-text-color: #fff;
  // 步骤条样式
  --step-success-border-color: #037fcd;
  --step-success-text-color: #037fcd;
  --step-process-border-color: #19d2fe;
  --step-process-text-color: #19d2fe;
  // 计数器样式
  --input-number-btn-bg: #037fcd;
  --input-number-btn-border-color: #037fcd;
  --input-number-btn-text-color: #fff;
  // el-form样式
  --form-label-text-color: #dddddd;
  --form-content-text-color: #fff;
  // upload样式
  --upload-list-text-color: #fff;
  // el-card样式
  --card-bg: #001a5d;
  --card-border-color: #122b6e;
  --card-text-color: #fff;
  // hamburger样式
  --hamburger-text-color: #fff;
  // checkbox样式
  --checkbox-checker-bg: #037fcd;
  --checkbox-checker-border-color: #037fcd;
  --checkbox-checker-text-color: #fff;
  --checkbox-checker-checked-text-color: #037fcd;
  // tree样式
  --tree-bg: #122b6e;
  --tree-hover-bg: #19d2fe;
  --tree-text-color: #fff;
  --tree-active-text-color: #037fcd;
  // loading加载
  --loading-icon-color: #fff;
  --loading-text-color: #fff;
  // descriptions 描述列表
  --descriptions-text-color: #fff;
  --descriptions-body-bg: #003f86;
  --descriptions-label-bg: #004795;
  --descriptions-border-color: #037fcd;
  // map地图
  --amap-marker-label-border-color: #333;
  --amap-marker-label-bg: #333;
  --amap-marker-label-text-color: #122b6e;
  // 导入弹窗
  --dialog-border-color: #1d4372;
  // 设备管理的统计
  --device-statistics-text-color: #c0c4cc;
  --device-statistics-text-color2: #fff;
  // card卡片样式
  --card-bg-color: #122b6e;
  --card-border-color: #037fcd;
}

// 中文样式
:root[language='zh'] {
  --side-bar-width: 200px;
  --side-bar-width-mobile: -160px;
  --header-title-text-size: 20px;
  --header-title-letter-spacing: 1px;
  --map-grid-cell-text-width: 60px;
  --locationMap-rightTip-bottom-justifyContent: center;
}

// 英文样式
:root[language='en'] {
  --side-bar-width: 310px;
  --side-bar-width-mobile: -240px;
  --header-title-text-size: 20px;
  --header-title-letter-spacing: 0px;
  --map-grid-cell-text-width: 74px;
  --locationMap-rightTip-bottom-justifyContent: flex-start;
}

// 系统主题-浅色主题
@media (prefers-color-scheme: light) {
  :root {
  }
}

// 系统主题-深色主题
@media (prefers-color-scheme: dark) {
  :root {
  }
}
